{% extends 'appbuilder/init.html' %}
{% import 'appbuilder/baselib.html' as baselib %}

{% block body %}
{% include 'appbuilder/general/confirm.html' %}
{% include 'appbuilder/general/alert.html' %}

{% block navbar %}
<header class="top" role="header">
    {% include 'appbuilder/navbar.html' %}
</header>
{% endblock %}


<div class="container">
    <div class="row">
        {% block messages %}
        {% include 'appbuilder/flash.html' %}
        {% endblock %}
        {% block content %}
        <div class="jumbotron">
            <div class="container">
                <div id="editor" type="text/plain"></div>

                <div id="alert" class="alert alert-success" role="alert">
                    <h3></h3>
                    <div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-sm-8">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h3 class="panel-title">Panel First</h3>
                            </div>
                            <div class="panel-body profile">
                                Content Of First Panel
                            </div>
                        </div>
                    </div><!-- /.col-sm-4 -->
                    <div class="col-sm-4">
                        <div class="panel panel-primary">
                            <div class="panel-heading">
                                <h3 class="panel-title">Panel Second</h3>
                            </div>
                            <div class="panel-body">
                                Content of Second Panel
                                <div class="progress">
                                    <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0"
                                         aria-valuemax="100" style="width: 60%;"><span
                                            class="sr-only">60% Complete</span></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <h3>Trays</h3>
                <div id="trays">

                </div>

                <h3>Wells</h3>
                <div class="well">
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius
                        blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent
                        commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit
                        amet fermentum. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia
                        odio sem nec elit. Aenean lacinia bibendum nulla sed consectetur.</p>
                </div>
            </div>
        </div>
        {% endblock %}
    </div>
</div>

{% block footer %}
<footer>
    <div class="img-rounded nav-fixed-bottom">
        <div class="container">
            {% include 'appbuilder/footer.html' %}
        </div>
    </div>
</footer>
{% endblock %}
{% endblock %}


{% block head_css %}
{{super()}}
<link href="http://cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css" rel="stylesheet">
<link href="/static/css/index.css" rel="stylesheet">
{% endblock %}


{% block add_tail_js %}
{{super()}}
<script src="/static/js/index.js"></script>
<script src="https://cdn.bootcss.com/socket.io/1.3.6/socket.io.min.js"></script>


<script type="text/javascript" charset="utf-8" src="{{ url_for('static', filename='ueditor/ueditor.config.js') }}"></script>
<script type="text/javascript" charset="utf-8" src="{{ url_for('static', filename='ueditor/ueditor.all.min.js') }}"> </script>
<!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
<!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
<script type="text/javascript" charset="utf-8" src="{{ url_for('static', filename='ueditor/lang/zh-cn/zh-cn.js') }}"></script>

<script type="text/javascript">
    //实例化编辑器
    //建议使用工厂方法getEditor创建和引用编辑器实例，如果在某个闭包下引用该编辑器，直接调用UE.getEditor('editor')就能拿到相关的实例
    var ue = UE.getEditor('editor', {
        serverUrl: "/ueditor/"
    });
</script>
{% endblock %}